import 'package:flutter/material.dart';
import 'package:im_flutter_sdk_example/pages/toolbar/alliance/widgets/project_expert.dart';
import 'package:im_flutter_sdk_example/pages/toolbar/alliance/widgets/timeline.dart';

import 'homepage.dart';

class Content extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    double rpx = MediaQuery.of(context).size.width / 750;
    return Scaffold(
      body: MainPage(
        rpx: rpx,
      ),
    );
  }
}

class MainPage extends StatefulWidget {
  MainPage({Key key, this.rpx});
  final double rpx;
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> with TickerProviderStateMixin {
  double extraPichHeight = 0; // 图片变化的高度
  double prevdy; // 初始点击位置
  BoxFit fitType; // 图片的适应方式

  AnimationController animationcontroller; // 动画控制器
  Animation<double> animation; // 动画

  @override
  void initState() {
    super.initState();
    prevdy = 0;
    fitType = BoxFit.fitWidth;
    animationcontroller = AnimationController(
        vsync: this, duration: Duration(milliseconds: 300)); // 动画时间
    animation =
        Tween(begin: 0.0, end: 0.0).animate(animationcontroller); // 效果绑定动画时间
  }

  // 手饰点击的时候执行
  updatePicHeight(changed) {
    print('prevdy：$prevdy');
    print('changed:$changed');
    // 如果初始点击位置为0，那么记录传入进来的点击的值
    // 如果之前没有点过，那么首次点击的位置就是手饰按下去的位置
    if (prevdy == 0) {
      prevdy = changed;
    }
    //计算图片应该变化的高度
    // 图片容器增长的高度 += 改变的高度坐标 - 鼠标上一个点的坐标（也就代表一直增长）
    extraPichHeight += changed - prevdy;
    // 如果下拉过了200后，就修改图片的适应格式
    if (extraPichHeight >= 200 * widget.rpx) {
      fitType = BoxFit.fitHeight;
    } else {
      fitType = BoxFit.fitWidth;
    }
    setState(() {
      prevdy = changed;
      extraPichHeight = extraPichHeight;
      fitType = fitType;
    });
  }

  // 手饰抬起的时候执行
  runAnimate() {
    setState(() {
      animation =
          Tween(begin: extraPichHeight, end: 0.0).animate(animationcontroller)
            ..addListener(() {
              if (extraPichHeight >= 200 * widget.rpx) {
                fitType = BoxFit.fitHeight;
              } else {
                fitType = BoxFit.fitWidth;
              }
              setState(() {
                extraPichHeight = animation.value;
                fitType = fitType;
              });
            });
      // 执行完回弹之后，初始点击变化值 再次初始化为0（保证移动-鼠标位置 = 增长的高度）
      //（避免保留着上一次的鼠标点击值，造成下一次点击的时候，移动的高度比点击的位置小）
      prevdy = 0;
    });
  }

  @override
  Widget build(BuildContext context) {
    double rpx = MediaQuery.of(context).size.width / 750;
    return Listener(
      onPointerMove: (result) {
        updatePicHeight(result.position.dy);
      },
      onPointerUp: (_) {
        runAnimate();
        animationcontroller.forward(from: 0); //
      },
      child: CustomScrollView(
        physics: ClampingScrollPhysics(),
        slivers: <Widget>[
          SliverAppBar(
            pinned: true,
            floating: true,
            actions: [
              IconButton(
                icon: Icon(Icons.search, color: Colors.white),
                onPressed: () {},
              )
            ],
            expandedHeight: 240 * rpx + extraPichHeight,
            flexibleSpace: FlexibleSpaceBar(
              title: Text('国科创新智库(北京)科技咨询有限公司', style: TextStyle(fontSize: 14)),
              centerTitle: true,
              background: SliverTopBar(
                extraPicHeight: extraPichHeight,
                fitType: fitType,
              ),
            ),
          ),
          SliverList(
              delegate: SliverChildBuilderDelegate((context, index) {
            // return Container(child: ProjectList(), color: Colors.white);
            return Container(child: TimeLineList(), color: Colors.white);
            // return Container(child: HomePage(), color: Colors.white);
          }, childCount: 1))
        ],
      ),
    );
  }
}

class SliverTopBar extends StatelessWidget {
  const SliverTopBar(
      {Key key, @required this.extraPicHeight, @required this.fitType});
  final double extraPicHeight;
  final BoxFit fitType;
  @override
  Widget build(BuildContext context) {
    double rpx = MediaQuery.of(context).size.width / 750;
    return Stack(
      children: <Widget>[
        Column(
          children: <Widget>[
            Image.network(
              'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1608614330166&di=d5005ba73aac0883b0631e05b9588c22&imgtype=0&src=http%3A%2F%2Fbpic.588ku.com%2Fback_pic%2F00%2F10%2F38%2F835633134d3e33f.jpg',
              width: 750 * rpx,
              height: 200 * rpx + extraPicHeight,
              fit: BoxFit.cover,
            ),
            // Container(
            //   height: 100 * rpx,
            // ),
            // Padding(
            //   padding: EdgeInsets.symmetric(horizontal: 10.0),
            //   child: Divider(
            //     color: Colors.grey[700],
            //   ),
            // ),
            Container(
              height: 100 * rpx,
            ),
          ],
        ),
        // Container(
        //   height: 200,
        //   color: Colors.red,
        //   width: double.infinity,
        //   child: Container(
        //     // width: 166 * rpx,
        //     // height: 166 * rpx,
        //     child: ClipRRect(
        //       child: Image.network(
        //         'http://b-ssl.duitang.com/uploads/item/201410/09/20141009224754_AswrQ.jpeg',
        //         width: 84,
        //         height: 84,
        //         fit: BoxFit.contain,
        //       ),
        //     ),
        //   ),
        // )
      ],
    );
  }
}
